import { defineComponent, computed } from 'vue'
import $style from './style.module.scss'

interface ISvgIcon {
  iconClass: string
  className?: string
}

export default defineComponent({
  name: 'SvgIcon',
  props: {
    iconClass: {
      type: String,
      required: true
    },
    className: {
      type: String,
      default: ''
    }
  },
  setup (props: ISvgIcon) {
    const iconName = computed(() => `#icon-${props.iconClass}`)
    // const svgClass = computed(() => 'svg-icon')

    return () => (
      <svg class={$style.svgIcon} aria-hidden={'true'}>
        <use xlinkHref={iconName.value}/>
      </svg>
    )
  }
})
